#chat>a>p{
	font-size: 4.4vw;
	margin-right: 2vw;
}
#chat>a{
	margin-left: 0.7vw;
	font-size: 4.4vw;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-left: -6vw;
	color: #000000;
}
.header{
	width: 100vw;
	height: 7vh;
	background-color: rgb(237,237,237);
	display: flex;
	margin: 0 auto;
	align-items: center;
	
	line-height: 7vh;
}

#chat>p:nth-child(2){
	font-size: 4vw;
	margin-left: -9.3vw;
}

#chat>img:nth-child(3){
	width: 4vmin;
	height: 4vmin;
	margin-left: 16vw;
}
#chat>img:nth-child(4){
	width: 7vmin;
	height: 6vmin;
	margin-left: 2vw;
}
.footer_chat{
	width: 100vw;
	height: 7vh;
	background-color:rgb(240,240,240);
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.main_chat{
		width: 100vw;
		height: 83vh;
		background-image: url(../img/bg.jpg);
		background-repeat: no-repeat;
		/* overflow: scroll; */
		display: flex;
		
		flex-direction: column-reverse;
		overflow-x: hidden;
		overflow: auto;
		/* -webkit-overflow-scrolling: touch; */
		/* overflow-y: hidden; */
		background-size: 100vw 82vh;
}
.voice{
	width: 10vw;
	height: 10vw;
	background-image: url(../img/语音.svg);
	background-repeat: no-repeat;
	background-size: 10vw 10vw;
}

.text{
	width: 52vw;
	height: 10vw;
	
}
.text>p{
	width: 52vw;
	height: 10vw;
	font-size: 3.8vw;
	border: 0.06vw solid black;
	padding-left: 2vw;
	line-height: 4.5vh;
	/* text-overflow: ellipsis; */
}
.face{
	width: 10vw;
	height: 10vw;
	background-image: url(../img/表情1.svg);
	background-repeat: no-repeat;
	background-size: 10vw 10vw;
}
.send{
	width: 10vw;
	height: 6vw;
	background-color: green;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10%;
	cursor: pointer;
}
.send>p{
	font-size: 3.2vw;
	color: white;
	
}
.speak1{
	width: 50vw;
	height:8vh;
	align-self: flex-end;
	margin-bottom: 2vw;
	display: flex;
	justify-content: space-between;
}

.right{
	width: 20vw;
	height:6vh;
	display: flex;
	justify-content: center;
}
.right>img{
	width: 12vw;
	height:12vw;
	border-radius: 20%;
}
.left{
	width: 44vw;
	height:4vh;
	font-size: 3.2vw;
	color: black;
	display: flex;
	justify-content: flex-start;
	align-content: flex-start;
	margin-top: 1.4vw;
}
.left>p{
	font-size: 4.5vw;
	color: black;
	line-height: 2vw;
	background-color: rgb(26,250,41);
	line-height: 4vh;
	width: 30vw;
	padding-left: 1vw;
	border-radius: 1vw;
}
.left>img{
	width: 6vw;
	height:6vw;
	margin-left: -2.35vw;
}


.speak2{
	width: 70vw;
	height:11vh;
	
	margin-bottom: 2vw;
	display: flex;
	justify-content: space-between;
}
.left1{
	width: 18vw;
	height:12vh;
	display: flex;
	justify-content: center;
}
.left1>img{
	width: 12vw;
	height:12vw;
	border-radius: 20%;
}
.right1{
	width: 56vw;
	height:8vh;
	display: flex;
	justify-content: space-between;
	border-radius: 20%;
	/* align-content: flex-start; */
}
.right1>p{
	font-size: 4.5vw;
	color: black;
	line-height: 7vw;
	background-color: white;
	width: 50vw;
	border-radius: 1vw;
}
.right1>img{
	width: 6vw;
	height:6vw;
	margin-right: -2.5vw;
}
.speak3{
	width: 50vw;
	height:8vh;
	align-self: flex-end;
	margin-bottom: 2vw;
	display: flex;
	justify-content: space-between;
}
.left3{
	width: 35vw;
}
.right3{
	width: 15vw;
}
audio{
	display: none;
}
.right4{
	width: 52vw;
    height: 8vh;
}
.right4>p{
	width: 49vw;
    height: 4vh;
	border-radius: 2vw;
	/* line-height: 2.5vw; */
	font-size: 4vw;
	display: flex;
	align-items: center;
}
.right4>img{
	width: 6.4vw;
	margin-right: -4vw;
}
.right4>p>img{
	width: 7.2vw;
	height: 6.2vw;
	margin-left: 3vw;
}
.speak5{
	width: 69vw;
    height:15.5vh;
}
.left5{
	width: 53vw;
    height: 11.5vh;
}
.left5>P{
	width: 50vw;
	line-height: 2.5vh;
}
.left7{
	width: 27vw;
}
.left7>img{
	width: 23vw;
	height: 23vw;
}
.speak7{
	width: 40vw;
}